//  登录功能实现

// 需要获取的操作元素


// 用户名 和 密码  
// 下面使用对象解构，因此没有用了
// const username = document.querySelector('#input-email')
// const password = document.querySelector('#input-password')



// 提示信息元素

// const toast = document.querySelector('.toast')
// toast.classList.remove('toast') 
// toast.style.display = "block"/
// toast.style.opacity = 1

// 注册按钮
const loginBtn = document.querySelector('#btn-login')

// 正则表达式

// username:username.value,
let uname = /^[a-zA-Z0-9]{8,30}$/

let paword = /^[a-zA-Z0-9]{6,30}$/


// serialize插件使用
const form = document.querySelector('.login-form')

// axios请求登录 'post'
async function loginUserData() {

    try {
        let data = serialize(form, { hash: true, empty: true })

        let userData = await axios({
            url: '/login',
            method: 'POST',
            data: data
        })
        //    console.log(userData);
        let userDate = userData.data
        console.log('登录获取的数据', userDate);
        alert('登录成功')
        return userDate
    } catch (error) {
        console.error(error.response.data.message)
    }
}

// 设置点击事件：登录
loginBtn.addEventListener('click', async (e) => {
    e.preventDefault()

    // 对象解构得到，对象属性的数据
    //  对象解构解释：解构是一种从数组或对象中提取数据的简洁语法。它允许你从数组或对象中提取值并赋给变量，而无需手动访问每个属性或索引。
    let data = serialize(form, { hash: true, empty: true })
    let { username,password } = data
   

    if (!uname.test(username) || !paword.test(password)) {
        alert('用户名或者密码不符合规范，请重新填写')
        location.reload()
        return
    } else {

        // 对登录得到的数据进行存储
        let userData = await loginUserData()
         // 对象解构

        let {username,token}=userData
        // 本地存储
        // let useData = getData()
    
        localStorage.setItem('username', username)
        localStorage.setItem('token', token)
        // console.log('函数得到的数据', userData)

        // alert('登录成功')
        location.href = `./index.html?uname =${username}`

    }
})


//  有点想当然的写法，困扰我一晚上？？？！！！！哭死
// let useData = localStorage.getItem(JSON.parse('useData'))
// console.log("得到的本地数据",useData);     


// 获取 本地存储的数据  无用
function getData() {
    try {
        
        let dstr = localStorage.getItem('useData')
        
        let  useData = JSON.parse(dstr)
        if(dstr!==null){
            return useData
        }else{
          return  []
        }
       
    } catch (err) {
        alert('本地存储获取出错')
        return []
    }
}




